<template>
    <ul>
        <li v-for="item in channels.channelsList"
            :class="{ select: item.hotindex === channels.$state.active }"
            :key="item.hotindex"
            @click="channels.changeActive(item.hotindex)">
            {{ item.word }}
        </li>
    </ul>
</template>

<script setup lang="ts">
import useStore from '../store/index';

const { channels } = useStore();

channels.getChannels()

</script>

<style scoped>
.select {
    color: red;
}
</style>